// @import './iconfont.css';

$color-main: #9C6DEF; // 主色调
$color-main-light: #C7B8FD; // 主色调浅色
$color-main-text: #21003D; // 主色调深色文字
$color-org: #F7622B; // 橙色
$color-text-desc: #BBB; // 浅灰色文字
$color-text-desc2: #B4B4B4; // 浅灰色文字

$bg-color-pink: #F8F1F8; // 背景颜色-粉色调
$bg-color-main: #EADDFF; // 浅色主色调背景颜色
$bg-color-grey: #D7D7D7; // 浅灰色标签背景
$bg-color-grey2: #D9D9D9; // 浅灰色标签背景2

/* 去除默认滚动条效果 */
::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
  color: transparent;
}

:root,
page {
  background-color: #FEFDFF !important;
}

.wot-theme-dark {
  color: #f5f5f5;
  background-color: #1b1b1b !important;
  min-height: 100vh;
}

.wot-theme-dark .wd-navbar {
  background-color: #1b1b1b !important;
}

.wot-theme-dark .wd-textarea__inner,
.wot-theme-dark .uni-textarea-wrapper,
.wot-theme-dark .wd-textarea,
.wot-theme-dark .wd-input {
  background-color: #141414 !important;
}

.wd-popup {
  z-index: 999 !important;
}

.wd-tabbar-item__body {
  .is-active {
    font-size: 22rpx !important;
  }
}

.wd-cell__right {
  flex: 2 !important;
}
.cell-placeholder {
  color: #bfbfbf !important;
}

.dark-color {
  background-color: #1b1b1b;
}

.dark-color2 {
  background-color: #141414;
}

.btn-w-164 {
  margin: 0 !important;
  border-radius: 16rpx !important;
  min-width: auto !important;
  width: 184rpx !important;
}

.btn-h-60 {
  font-size: 24rpx !important;
  height: 60rpx !important;
  line-height: 0 !important;

  .wd-button {
    height: 100% !important;
  }
}

.btn-w-294 {
  margin: 0 !important;
  border-radius: 16rpx !important;
  min-width: auto !important;
  width: 294rpx !important;
}

.btn-h-96 {
  font-size: 28rpx !important;
  height: 96rpx !important;
  line-height: 0 !important;

  .wd-button {
    height: 100% !important;
  }
}

.btn-w-94 {
  margin: 0 !important;
  border-radius: 94rpx !important;
  min-width: auto !important;
  width: 94rpx !important;
}

.btn-w-120 {
  margin: 0 !important;
  border-radius: 120rpx !important;
  min-width: auto !important;
  width: 120rpx !important;
}

.btn-h-42 {
  font-size: 24rpx !important;
  height: 42rpx !important;
  line-height: 0 !important;
}

.btn-w-full {
  margin: 0 !important;
  border-radius: 16rpx !important;
  min-width: auto !important;
  width: 100% !important;
}

.btn-h-78 {
  font-size: 32rpx !important;
  height: 78rpx !important;
  line-height: 0 !important;
}

.btn-bg-gra {
  background: linear-gradient(to right, rgba(152, 109, 240, 1), rgba(235, 181, 251, 1));
}

.btn-full {
  & > button {
    width: 100%;
  }
}

.btn-full-r16 {
  & > button {
    width: 100%;
    // height: 100% !important;
    min-width: auto !important;
    border-radius: 16rpx !important;
  }
}

.color-main {
  color: $color-main;
}

.bg-color-main {
  background-color: $color-main !important;
}

.title-com {
  @apply m-a font-600;
}

.position-center-com {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
}

.position-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.position-t-center {
  @extend .position-center-com;
  top: 0;
}

.position-b-center {
  @extend .position-center-com;
  bottom: 0;
}

.position-l-center {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}

.position-c-center {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}

.position-b-r {
  position: absolute;
  right: 0;
  bottom: 0;
  transform: translate(0, 100%);
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-sb-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-sb {
  display: flex;
  justify-content: space-between;
}

.flex-a-center {
  display: flex;
  align-items: center;
}

.w-center {
  margin: 0 auto;
  width: 686rpx;
}

.w-center-slider {
  margin: 0 auto;
  width: 630rpx;
}

.w-center-750 {
  margin: 0 auto;
  width: 750rpx;
}

.btn-com {
  width: 100% !important;
  height: 100% !important;
}

.border-1px {
  width: 100%;
  height: 1px;
  background-color: rgba(187, 187, 187, 0.6);
  transform: scaleY(0.5);
}

.border-2px {
  width: 100%;
  height: 2px;
  background-color: rgba(187, 187, 187, 0.6);
  transform: scaleY(0.5);
}

.border-2 {
  border: 2rpx solid #9C6DEF;
}

.tran-y-100 {
  transform: translate(0, -100%);
}

.f-20 { font-size: 20rpx; }
.f-22 { font-size: 22rpx; }
.f-24 { font-size: 24rpx; }
.f-28 { font-size: 28rpx; }
.f-32 { font-size: 32rpx; }
.f-40 { font-size: 40rpx; }

.box-sd {
  box-shadow: 0 2rpx 6rpx 2rpx rgba(0,0,0,0.15), 0 2rpx 4rpx 0 rgba(0,0,0,0.3);
}

.btn-sd {
  box-shadow: 0 4rpx 28rpx 0 rgba(0,0,0,0.09);
}

.bg-linear-1 {
  background: linear-gradient( 154deg, #D4A1F8 0%, #9C6DEF 100%);
}

.bg-linear-2 {
  background: linear-gradient( 154deg, #F8BEA1 0%, #EF856D 100%);
}

.bg-linear-3 {
  background: linear-gradient( 154deg, #F3E2FF 0%, #E6DAFC 100%);
}

.bg-linear-4 {
  background: linear-gradient( 154deg, #F0E2DA 0%, #FFD5CB 100%);
}

.bg-linear-5 {
  background: linear-gradient( 180deg, #9C6DEF 0%, #E5C4FF 100%);
}

.bg-linear-6 {
  background: linear-gradient( 270deg, #AE61F6 0%, #E7D1FD 100%);
}

.bg-linear-7 {
  background: linear-gradient( 90deg, #9C6DEF 0%, #D4A1F8 100%);
}

.bg-linear-8 {
  background: linear-gradient( 180deg, #AE80F3 0%, #D6A3F8 100%);
}

.bg-linear-9 {
  background: linear-gradient( 270deg, #E0D8FF 0%, #FFF8F8 100%);
}

.share-btn {
  position: absolute !important;
  left: 0;
  top: 0;
  width: 100%;
  height: 100% !important;
  min-width: auto !important;
  opacity: 0;
}

.wd-button.is-primary {
  background: linear-gradient( 180deg, #9C6DEF 0%, #E5C4FF 100%) !important;
}
.wd-button.is-plain {
  background: #fff !important;
}

.wd-switch.is-checked {
  background: linear-gradient( 180deg, #9C6DEF 0%, #E5C4FF 100%) !important;
}

.vip-bg-color .wd-action-sheet__action {
  &:last-child {
    background-color: #fcf7ff !important;
  }
}

.toast-com-wrap .wd-toast__msg {
  color: $color-main;
  font-size: 32rpx !important;
  font-weight: 900;
}